<template>
    <div>
        <el-breadcrumb>
          <el-breadcrumb-item>首页</el-breadcrumb-item>
          <el-breadcrumb-item v-breadcrumb-certify></el-breadcrumb-item>
        </el-breadcrumb>
        <div class="content">
            <e-heading>赛事赞助</e-heading>
            <el-row>
              <el-col :span="6" v-for="(item,index) in list" :key="index">
                <a class="sport-item" @click="go(item.path)">
                  <e-img-match :src="item.imgUrl" alt="" />
                  <div class="m_name">{{item.label}}</div>
                </a>
              </el-col>
            </el-row>
        </div>
    </div>
</template>

<script>
  import { mapGetters } from 'vuex'
  export default{
    computed: {
      ...mapGetters({
        global: 'global'
      })
    },
    data () {
      let isCertify
      return {
        isCertify,
        list: [
          {
            imgUrl: '/static/images/sponsor/sponsor_business.png',
            label: '我要招商',
            path: 'sponsor/merchants'
          },
          {
            imgUrl: '/static/images/sponsor/sponsor_support.png',
            label: '我要赞助',
            path: 'sponsor/support'
          },
          {
            imgUrl: '/static/images/sponsor/sponsor_brand.png',
            label: '赞助品牌',
            path: 'sponsor/brand'
          },
          {
            imgUrl: '/static/images/sponsor/sponsor_talk.png',
            label: '约谈',
            path: 'sponsor/talk/support'
          }
          // {
          //   imgUrl: '/static/images/sponsor/sponsor_report.png',
          //   label: '赛事报告',
          //   path: 'sponsor/report'
          // }
        ]
      }
    },
    methods: {
      go (obj) {
        this.$router.push({path: obj})
      }
    }
  }
</script>
<style lang="scss">
  
  .sport-item {
    text-align: center;
    width: 100%;
    display: block;
    &:hover{
      color:$color-primary;
    }
    .m_name {
      padding: 20px 0;
    }
  }
</style>
